<!DOCTYPE html>
<html>
	<head>
		<meta charset="UTF-8">
		<meta name="viewport" content="width=device-width,initial-scale=1,minimum-scale=1,maximum-scale=1,user-scalable=no" />
		#include("common/header.html")
		<link type="text/css" rel="stylesheet" href="/css/myadress.css" />
		<title></title>
	</head>
	<body>
		<header style="background: #005aab;" class="mui-bar mui-bar-nav head">
			<!--<span class="mui-icon mui-icon-back"></span>-->
			<h1 style="color: #FFFFFF; letter-spacing: 4px;" class="mui-title">我的地址</h1>
			<!--<span class="mui-icon mui-icon-more"></span>-->
		</header>
		<nav style="background: #cccccc;" id="bottomx" class="mui-bar mui-bar-tab">
			<a class="mui-tab-item" href="/business/">
				<span class="mui-icon iconfont icon-qiyedengji-copy"></span><br>
				<span class="mui-tab-label">业绩登记</span>
			</a>
			<a class="mui-tab-item mui-active" href="/integral/">
				<span class="mui-icon iconfont icon-icon18"></span><br>
				<span class="mui-tab-label">积分兑换</span>
			</a>
			<a class="mui-tab-item" href="/v/center">
				<span class="mui-icon iconfont icon-gerenzhongxin"></span><br>
				<span class="mui-tab-label">个人中心</span>
			</a>
		</nav>
		<div class="mui-content">
			<div id="xinzeng" class="address">
				<img src="/img/jiahao.png"/>
				<span>新增地址</span>
			</div>
			<input type="hidden" id="uid" value="${uid}" />
			<ul class="mui-table-view">
				#foreach($item in $addrs)
				<li class="mui-table-view-cell">$item.province $item.city $item.area $item.addr</li>
				#end
			</ul>
		</div>
	</body>
	<script>
		nav_tab();
		
		(function($, doc) {
			$.ready(function() {
				mui.init();
				var pickerts='';
				document.getElementById("xinzeng").addEventListener('tap',function(e){
					e.detail.gesture.preventDefault(); //修复iOS 8.x平台存在的bug，使用plus.nativeUI.prompt会造成输入法闪一下又没了
	                var btnArray = ['取消', '确定'];
					var pickers ='<div class="mui-input-row" id="more_input">\
				        <input id="showCityPicker3" style="width: 19%; padding: 0;padding-left: 5px;" type="text" class="mui-input-clear" placeholder="省">\
				        <div class="diqu">省</div>\
				        <input id="showCityPicker2" style="width: 19%; padding: 0;padding-left: 5px;" type="text" class="mui-input-clear" placeholder="市">\
				        <div class="diqu">市</div>\
				        <input id="showCityPicker1" style="width: 19%; padding: 0;padding-left: 5px;" type="text" class="mui-input-clear" placeholder="区">\
				    </div>';
	                mui.prompt(pickers, '请输入详细地址', '添加新地址', btnArray, function(e) {
	                    if (e.index == 1) {

	                        var addr = e.value;
                            var province = doc.getElementById('showCityPicker1').value;
                            var city=doc.getElementById('showCityPicker2').value;
                            var area=doc.getElementById('showCityPicker3').value;
	                        var uid = doc.getElementById('uid').value;

	                        if(province == "" || city == "" || addr == ""){
                                mui.toast('参数不能为空!');
                                return;
							}

                            mui.ajax('/v/address', {
                                data: {
                                    uid: uid,
                                    province : province,
                                    city : city,
                                    area : area,
                                    addr : addr
                                },
                                dataType: 'json',//服务器返回json格式数据
                                type: 'post',//HTTP请求类型
                                timeout: 10000,//超时时间设置为10秒；
                                success: function (data) {
                                    //服务器返回响应，根据响应结果，分析是否登录成功；
                                    console.log(data);
                                    if(data.code == -1){
                                        mui.toast(data.msg);
                                        return;
                                    }

                                    mui.alert('提交成功!',"提示","确定",function () {
                                        mui.openWindow({
                                            url: '/v/address',
                                            id:'/v/address'
                                        });
                                    });
                                },
                                error: function (xhr, type, errorThrown) {
                                    //异常处理；
                                    console.log(type);
                                    mui.toast('请求异常,请稍后重试!');
                                }
                            });

	                    }
	                    document.querySelector('.mui-popup-input input').placeholder='请输入详细地址';
	           		})
                var cityPicker3 = new $.PopPicker({
					layer: 3
				});
				cityPicker3.setData(cityData3);
				var show_sheng = doc.getElementById('showCityPicker1');
				var show_shi=doc.getElementById('showCityPicker2');
				var show_qu=doc.getElementById('showCityPicker3');
				var more_input=document.getElementById("more_input");
				var listinput=more_input.getElementsByClassName("mui-input-clear");
				for(var i=0;i<listinput.length;i++){
					listinput[i].addEventListener('tap',function(event) {
					cityPicker3.show(function(items) {
						pickerts=(items[0] || {}).text +  (items[1] || {}).text + (items[2] || {}).text;
						sheng=(items[0] || {}).text;
						shi=(items[1] || {}).text;
						qu=(items[2] || {}).text;
						if(sheng.indexOf("省")>0){
							show_sheng.value=sheng.substring(0, sheng.lastIndexOf('省'));
						}else{
							show_sheng.value=sheng
						};
						if(show_shi.value.indexOf("市")>0){
							show_shi.value=shi.substring(0, shi.lastIndexOf('市'));
						}else{
							show_shi.value=(items[1] || {}).text;
						};
						if(qu==""){
							show_qu.value=''
						}else{
							show_qu.value=qu
						};
						//返回 false 可以阻止选择框的关闭
//							return false;
					});
				}, false);
				}
				})
			});
		})(mui, document);
	</script>
</html>
